import React, { useEffect, useState } from 'react'

export default function App() {
  const [list, setList] = useState([])
  useEffect(() => {
    // fetch 返回的是 Promise
    // 如果后端返回的是 JSON 格式的字符串 => r.json()
    /* fetch('http://geek.itheima.net/v1_0/user/channels')
      .then((r) => r.json())
      .then((r) => {
        console.log(r)
      }) */
    const getList = async () => {
      const r = await fetch('http://geek.itheima.net/v1_0/user/channels')
      const {
        data: { channels },
      } = await r.json()
      setList(channels)
    }
    // !一定记得调用
    getList()
  }, [])
  return (
    <ul>
      {list.map((item) => (
        <li key={item.id}>{item.name}</li>
      ))}
    </ul>
  )
}
